<template>
	<div class="resources">
		<TopNav />
		<div class="block">
			<div class="date">
				<el-date-picker v-model="value1" type="daterange" range-separator="至" start-placeholder="开始日期"
					end-placeholder="结束日期" @change="(value) => changeHandler(value)" format="yyyy 年 MM 月 dd 日"
					value-format="yyyy-MM-dd">
				</el-date-picker>
			</div>
		</div>
		<div class="list" :style="{minHeight:clientHeight+'px'}">
			<h3>资源包审核</h3>
			<div class="conter">
				<div class="serch">
					<div class="sous">
						<el-input placeholder="请输入标题名称" v-model="inputVla"></el-input>
						<el-button size="small" icon="el-icon-search" @click='resetSearch'></el-button>
					</div>
					<div class="examine">
						<el-button size="small" icon="el-icon-refresh" class="ref" @click="ref"></el-button>
						<el-button type="primary"  icon="el-icon-edit" class="audit" @click='audit'
							:disabled="disabled">审核
						</el-button>
								<el-button type="primary"  icon="el-icon-edit" class="audit" @click='changeAudit(0)'
							:disabled="disabled">待审核
						</el-button>
								<el-button type="primary"  icon="el-icon-edit" class="audit" @click='changeAudit(1)'
							:disabled="disabled">审核通过
						</el-button>
								<el-button type="primary" icon="el-icon-edit" class="audit" @click='changeAudit(2)'
							:disabled="disabled">审核不通过
						</el-button>
									<el-button type="primary" v-show="InsideControl" icon="el-icon-edit" class="audit" @click='changeAudit(4)'
							:disabled="disabled">转审
						</el-button>
						<div class="waitAuditStyle">
							待审核：<span @click="lookDaiData"> {{waitingAudit}}</span>
						</div>
								<div class="waitAuditStyle">
							转审：<span @click="lookZhuanData"> {{changeAuditNum}}</span>
						</div>
						
					</div>
					<div style="margin-top:20px">
						 审核状态：<el-select v-model="States" style="width:120px;margin-right:20px" @change="SelectChange"   placeholder="请选择">
    <el-option
      v-for="item in options"
      :key="item.value"
      :label="item.text"
      :value="item.value">
    </el-option>
  </el-select>
					<!-- 分享范围：<el-select v-model="sharetype" style="width:120px;" @change="fetchData('','','1')"   placeholder="请选择">
    <el-option label="全部" value=""> </el-option>
				 <el-option label="本校" value="0"> </el-option>
					 <el-option label="全网" value="1"> </el-option>
  </el-select> -->
			机构： <el-select v-model="school_id" style="width:120px;" @change="fetchData('','','1')"   placeholder="请选择">
    <el-option
      v-for="item in schoolList"
      :key="item.id"
      :label="item.name"
      :value="item.id">
						</el-option>
  </el-select>
					</div>
					<el-dialog title="审核情况" :visible.sync="dialogVisible" width="800px"  :before-close="handleClose">
						<el-form ref="form" :model="sizeForm" label-width="80px" size="mini">
							<el-form-item label="所属学校:">
								<el-input v-model="sizeForm.school_name" disabled></el-input>
							</el-form-item>
							<el-form-item label="用户:">
								<el-input v-model="sizeForm.nickname" disabled></el-input>
							</el-form-item>
							<el-form-item label="备课标题:">
								<el-input v-model="sizeForm.title" disabled></el-input>
							</el-form-item>
							<el-form-item label="分享:">
								<el-input v-model="sizeForm.share_type_text" disabled></el-input>
							</el-form-item>
							<el-form-item label="课程资源文件:">
								<el-input v-model="sizeForm.coursefile" disabled></el-input>
								<ul class="select-list" v-show="listData.length>0">
				
										<li  v-for="(vo, j) in listData" :key="j" style="margin-bottom: 10px;" >
											<div   :class="['pic_area',  'ico-'+getFileType(vo)]" v-if="getFileType(vo) != 'image' "  @click="goDetail(j, vo)"> </div>
											<img   :src="vo" :class="pic_area" v-if="getFileType(vo) == 'image' "  @click="goDetail(j, vo)"> </img>
										</li>
					
								</ul>
							</el-form-item>
							<el-form-item label="我的空间文件:">
								<el-input v-model="sizeForm.userfile" disabled></el-input>
                <ul class="select-list" v-if="sizeForm.userfile">
                	<template >
                		<li v-for="(vo, j) in sizeForm.userfile" :key="j" style="margin-bottom: 10px;" >
                			<div   :class="['pic_area',  'ico-'+getFileType(vo)]" v-if="getFileType(vo) != 'image' "  @click="goDetail(j, vo)"> </div>
                      <img   :src ="vo" :class="pic_area" v-if="getFileType(vo) == 'image' "  @click="goDetail(j, vo)"> </img>
                		</li>
                	</template>
                </ul>
							</el-form-item>
							<el-form-item label="资源文件:">
								<el-input v-model="sizeForm.file" disabled></el-input>
                <ul class="select-list" v-if="sizeForm.file">
                 
                    <li v-for="(vo, j) in sizeForm.file" :key="j"  style="margin-bottom: 10px;" >
                     <div   :class="['pic_area',  'ico-'+getFileType(vo)]" v-if="getFileType(vo) != 'image' "  @click="goDetail(j, vo)"> </div>
                     <img   :src ="vo" :class="pic_area" v-if="getFileType(vo) == 'image' "  @click="goDetail(j, vo)"> </img>
                    </li>
                 
                </ul>
							</el-form-item>
							<el-form-item label="状态值:">
								<el-radio-group v-model="sizeForm.resource">
									<el-radio label="0">待审核</el-radio>
									<el-radio label="1">审核通过</el-radio>
									<el-radio label="2">审核不通过</el-radio>
								</el-radio-group>

							</el-form-item>
							<el-form-item label="审核备注:">
								<el-input v-model="description"></el-input>
							</el-form-item>
							<el-form-item size="large">
								<el-button type="primary" @click="onSubmit">确定</el-button>
								<el-button @click="qx">取消</el-button>
							</el-form-item>
						</el-form>

					</el-dialog>
				</div>

        <el-dialog title="查看" :visible.sync="dialogVisibleV" width="840px" :before-close="handleCloseV">
          <div class="play_area">
            <!-- 视频音频 -->
            <div id="course-player" v-if="getFileType(currentZiyuan.file) == 'video' || getFileType(currentZiyuan.file) == 'radio'"></div>
            <!-- office文件 -->
            <iframe
              class="course-iframe"  style="width: 800px;height: 451px;"
              :src="'https://ow365.cn/?i=28004&ssl=1&n=5&furl=' + currentZiyuan.file"
              v-else-if="
                getFileType(currentZiyuan.file) == 'excel' ||
                  getFileType(currentZiyuan.file) == 'word' ||
                  getFileType(currentZiyuan.file) == 'pdf' ||
                  getFileType(currentZiyuan.file) == 'ppt'
              "
            ></iframe>
            <!-- 图片 -->
            <div v-else-if="getFileType(currentZiyuan.file) == 'image'"><img :src="currentZiyuan.file"  style="width: 800px;height: 451px;" /></div>
            <!-- 图片 -->
            <div v-else-if="getFileType(currentZiyuan.file) == 'html'"><iframe :src="currentZiyuan.file"  style="width: 800px;height: 451px;" /></div>

            <!-- swf文件 -->
            <template v-else-if="getFileType(currentZiyuan.file) == 'swf'">
              <object :data="currentZiyuan.file" type="application/x-shockwave-flash" style="width: 800px;height: 451px;">
                <param name="movie" value="demo.swf" style="width: 100%;height: 100vh;" />
                <embed :src="currentZiyuan.file" style="width: 100%;height: 100vh;" />
              </object>
            </template>
          </div>
        </el-dialog>

				<div class="table">
					<el-table  
						:row-key="getRowkeys"
					:data="tableData"
						:cell-style="columnStyle" style="width: 100%" ref="listTable"
						@selection-change="handleSelectionChange">
						<el-table-column type="selection" :reserve-selection='true' width="50">
						</el-table-column>
							<el-table-column prop="createtime_text" label="创建时间">
										<template slot-scope="scope">
									<div class="shareText" @click="ChangeTime(scope.row.createtime_text)">{{scope.row.createtime_text}}</div>		
							</template>
						</el-table-column>
						<el-table-column prop="share_type_text" label="分享位置">
							<template slot-scope="scope">
									<div class="shareText" :class="scope.row.share_type_text=='本校'?'greenFont':''" @click="ChangeShare(scope.row.share_type)">{{scope.row.share_type_text}}</div>		
							</template>
						</el-table-column>
									<el-table-column prop="school.name" label="学校/机构">
						</el-table-column>
						<el-table-column prop="user.nickname" label="分享教师">
								<template slot-scope="scope">
									<div class="shareText" @click="ChangeTeacher(scope.row.user_id)">{{scope.row.user.nickname}}</div>		
							</template>
						</el-table-column>
									<el-table-column prop="bclass.title" label="备课标题">
														<template slot-scope="scope">
									<div class="shareText"  @click="ChangeTitle(scope.row.bclass.title)">{{scope.row.bclass.title}}</div>		
							</template>
						</el-table-column>	
								<el-table-column prop="suser_name" label="审核人">
													<template slot-scope="scope">
									<div class="shareText"  @click="ChangeSuser(scope.row.suser_id)">{{scope.row.suser_name}}</div>		
							</template>
						</el-table-column>
			
						<el-table-column prop="description" label="审核备注">
							
										<template slot-scope="scope">
									<div class="shareText"  @click="ChangeDesc(scope.row.description)">{{scope.row.description}}</div>		
							</template>
						</el-table-column>
						<el-table-column prop="state_text" label="审核状态">
						</el-table-column>

					</el-table>
					<el-pagination background ref="page" @size-change="handleSizeChange" @current-change="handleCurrentChange"
						:current-page="currentPage" :page-size="pageSize" layout="total, prev, pager, next"
						:total="total">
					</el-pagination>
				</div>
			</div>
		</div>

	</div>


</template>

<script>
var player;
	import TopNav from './TopNav.vue'
	// let token = sessionStorage.getItem("token");
	export default {
		name: 'index',
		components: {
			TopNav
		},
		data() {
			return {
				value1: '',
				total: 0,
				currentPage: 0,
				pageSize: 0,
				tableData: [],
				sizeForm: {
					school_name: '',
					nickname: '',
					title: '',
					share_type_text: '',
					coursefile: '',
					userfile: '',
					file: '',
					resource: '0'

				},
				dialogVisible: false,
				disabled: false,
				fullscreenLoading: false,

        dialogVisibleV: false,
        currentZiyuan:{},

				ids: '',
				state_text: '',
				user_id: '',
				id: '',

				dragOptions: {
					animation: 500,
					filter: '.add-one'
				},
				listData: [],
				starttimes: '',
				endtimes: '',
				inputVla:'',
				daiData:"0",
				zhuanData:'0',
				waitingAudit:0,
				changeAuditNum:0,
				InsideControl:false,
				clientHeight:0,
				State:'',
				States:'',
				sharetype:'',
				moreids:'',
				schoolList:[],
				school_id:'',
				userid:'',
				token:"",
				createtime:'',
				suser_id:'',
				title:"",
				description:'',
				options:[
					{
						value:'',
						text:'全部'
					},{
						value:0,
						text:'待审核'
					},{
						value:1,
						text:'审核通过'
					},{
						value:2,
						text:'审核不通过'
					},
				]
			}
		},
		created(){
			  this.token= sessionStorage.getItem("token");
	
		},
		mounted() {
					this.JudgeInit()
			 this.clientHeight = document.body.clientHeight - 120 - 64
			this.fetchData()
		},
		methods: {
			getRowkeys(row){
				
				return row.id
			},
			JudgeInit(){ // 判断权限
			const vm=this
											vm.axios({
												method: 'post',
												url: vm.$api +'/index/bclass_share/init',
												data:{
													token: vm.token
												},
												}).then(function(res) {
														console.log(res)
														vm.waitingAudit=res.data.data.dainum
															vm.changeAuditNum=res.data.data.zhuannum
														vm.InsideControl=res.data.data.auth===1?false:true
											})	
											vm.axios({
												method: 'post',
												url: vm.$api +'/index/index/getSchool',
												data:{
													token: vm.token
												},
												}).then(function(res) {
														console.log(res)
														let first =[{
															id:'',
															name:'全部'
														}]
														vm.schoolList=[...first,...res.data.data]
	
											})	
			},
			resetSearch(){
				this.State=''
			},
			SelectChange(value){
					console.log(value)
					this.State=""
					this.fetchData('','','1')
			},
					ChangeTime(time){
				this.createtime=time
						this.fetchData('','','1')
			},
			ChangeShare(type){
				this.sharetype=type
					this.fetchData('','','1')
			},
			ChangeTeacher(userid){
						this.userid=userid
					this.fetchData('','','1')
			},
			ChangeSuser(time){
				this.suser_id=time
						this.fetchData('','','1')
			},
			ChangeTitle(type){
				this.title=type
					this.fetchData('','','1')
			},
			ChangeDesc(userid){
						this.description=userid
					this.fetchData('','','1')
			},
			changeHandler(value) {
				var star = new Date(new Date(new Date(value[0]).toLocaleDateString()).getTime())
				this.fullscreenLoading = true;
				setTimeout(() => {
					this.fullscreenLoading = false;
				}, 2000);
				var starttime = (new Date(star)).getTime() / 1000;
				var endtime = (new Date(value[1]+ ' 23:59:59')).getTime() / 1000;
				this.fetchData(starttime, endtime)
				this.starttimes = starttime
				this.endtimes = endtime
			},
			lookDaiData(){
					this.State=0
					this.fetchData()
			},
						lookZhuanData(){
			this.State=3
					this.fetchData()
			},
						ref() {
				this.fullscreenLoading = true;
						this.school_id='';
						this.currentPage=1;
						this.sharetype=''
						this.inputVla=''
						this.States=''
						this.State=''
						this.userid=''
						this.createtime=''
					this.suser_id=''
						this.title=""
						this.description=''
								this.fetchData()
				setTimeout(() => {
					this.fullscreenLoading = false;
				}, 2000);

			},
			fetchData(starttime, endtime,val) {
				var self = this;
				this.currentPage=val=='1'?1:this.currentPage
				this.axios({
					method: 'post',
					url: this.$api + '/index/bclass_share/index',
					data: {
						token:  this.token,
						endtime: endtime,
						starttime: starttime,
						page:this.currentPage,
						share_type:this.sharetype,
						keyword:this.inputVla,
						state: val?this.States:this.State,
						school_id:this.school_id,
						user_id:this.userid,
						createtime:this.createtime,
						suser_id:this.suser_id,
						title:this.title,
						description:this.description,

					},
				}).then(function(res) {
          if (res.data.code == 401) {
            self.$message({
            	message: '请登录后再操作！',
            });
            self.$router.push({
              name: 'login'
            })
          }
									
					if (self.currentPage == 1) {
					  self.currentPage = 1;
					} else if (self.currentPage == self.total) {
					  self.currentPage = self.total;
					}
					self.total = res.data.data.total;
					self.pageSize = res.data.data.per_page;
					self.currentPage = res.data.data.current_page;
					var items = [];
					for (var i = 0; i < res.data.data.data.length; i++) {
						var item = res.data.data.data[i];
						item.createtime = self.$moment(item.createtime).format("YYYY-MM-DD HH:SS");
						items.push(item)
			
					};

					self.tableData = items;


				})
			},
			columnStyle({
				row,
				column,
				rowIndex,
				columnIndex
			}) {
				this.state_text = row.state_text;
				if (row.state_text === '审核通过' && columnIndex === 8) {
					return "color:#55E4C2"
				} else if (row.state_text === '审核不通过' && columnIndex === 8) {
					return "color:#EB0C0C"
				} else {}
				if (row.share_type_text === '本校' && columnIndex === 2) {
					return "color:#55E4C2"
				}
			},
			handleClose(done) {
				done();
			},
      handleCloseV(done) {
        done();
        if (player) {
          player.dispose();
        }
      },
			handleSizeChange: function(size) {
				this.pagesize = size;
			},
			handleCurrentChange: function(currentPage) {
				var self = this
				this.currentPage = currentPage;
				this.fetchData(self.starttimes,self.endtimes,self.inputVla,currentPage);
			},

			handleSelectionChange(val) {
				console.log(val)
				this.ids = val
				// if (val.length > 1) {
				// 	this.$refs.listTable.clearSelection();
				// 	this.$refs.listTable.toggleRowSelection(val.pop());

				// 	return;
				// } else {
				// 	this.ids = val
				// }
			},
			audit() {
				var self = this
				if (self.ids == '') {
					self.$message({
						message: '请选择需要审核的内容！',
					});
				} else if(self.ids.length>1){
							self.$message({
						message: '审核条数仅限一条！',
					});
				}
				else{
				
							var id = this.ids
							var items;
							for (var i = 0; i < id.length; i++) {
								var item = id[i].id;
								items = item
							};
							this.axios({
								method: 'post',
								url: this.$api + '/index/bclass_share/edit',
								data: {
									token: self.token,
									id: items
								},
							}).then(function(res) {
								var data = res.data.data
								self.sizeForm.school_name = data.school_name
								self.sizeForm.nickname = data.nickname
								self.sizeForm.title = data.title
								self.sizeForm.share_type_text = data.share_type_text
								self.sizeForm.coursefile = data.coursefile
								self.sizeForm.userfile = data.userfile
								self.sizeForm.file = data.file
								self.user_id = data.user_id
								self.id= data.id
								self.listData = self.sizeForm.coursefile
							})
							this.dialogVisible = true
				
		
						
				}
				// if(this.ids.length<0){
				// 	this.dialogVisible = false
				// }else{
				//
				// }

			},
			changeAudit(type){
					const vm =this
					console.log(vm.ids)
					if(!vm.ids.length){
										vm.$message({
						message: '请选择需要审核的内容！',
					});
					return
					}
					if(type=='4'&&!vm.ids[0].share_type=='1'){
								vm.$message.error({
									message:'只有全网的才可以转审核！'
								})
					}
				
					  vm.ids.forEach(item => {
								vm.moreids+=item.id+','
					});
				let message = type =='0'?'待审核':type=='1'?'审核通过':type=='4'?'转审':'待审核'
				let url = type=='4'?'/index/bclass_share/referral':"/index/bclass_share/examine"
				let data = type=='4'?{
											token: vm.token,
													id: 	vm.moreids.substring(vm.moreids.length-1,0)
				}:{
													token:vm.token,
													state:type,
													id:	vm.moreids.substring(vm.moreids.length-1,0)
				}
				 vm.$confirm(`确认要将该资源包状态更改为${message}状态吗`, '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
									
											vm.axios({
												method: 'post',
												url: vm.$api + url,
												data:data,
											}).then(function(res) {
										if(res.data.code==0){
																			vm.$message({
														message:res.data.msg,
														type: 'error',
													})
												}else{
														vm.$message({
														message:'操作成功！',
														type: 'success',
													})
																vm.moreids=''
												vm.fetchData()
												vm.JudgeInit()
							
												}
								
															})	
        }).catch(() => {
                  
        });
			},	
			onSubmit() {
				var self = this;
				this.axios({
					method: 'post',
					url: this.$api + '/index/bclass_share/shenhe',
					data: {
						token: self.token,
						state: this.sizeForm.resource,
						user_id: this.user_id,
						id: this.id,
						description: this.description
					},
				}).then(function(res) {
									self.JudgeInit()
					self.dialogVisible = false
					self.fetchData()
				})
			},
			// sousuo() {
			// 	var self = this
			// 	this.axios({
			// 		method: 'post',
			// 		url: this.$api + '/index/bclass_share/index',
			// 		data: {
			// 			token: token,
			// 			endtime: this.endtimes,
			// 			starttime: this.starttimes,
			// 			keyword:this.inputVla,
			// 			dai:this.daiData,
			// 			zhuan:this.zhuanData
			// 		},
			// 	}).then(function(res) {
			// 		self.total = res.data.data.total;
			// 		self.pageSize = res.data.data.per_page;
			// 		self.currentPage = res.data.data.current_page;
			// 		var items = [];
			// 		for (var i = 0; i < res.data.data.data.length; i++) {
			// 			var item = res.data.data.data[i];
			// 			item.createtime = self.$moment(item.createtime).format("YYYY-MM-DD HH:SS");
			// 			items.push(item)
			// 		};

			// 		self.tableData = items;

			// 	})
			// },
			qx() {
				this.dialogVisible = false
			},


			goDetail(index, item) {
        this.currentZiyuan.file = item;
        this.dialogVisibleV = true;
        console.log(this.getFileType(this.currentZiyuan.file))
        if (this.getFileType(this.currentZiyuan.file) == 'video' || this.getFileType(this.currentZiyuan.file) == 'radio') {
          this.aliplay(this.currentZiyuan.file);
        }
			},
			
      // 阿里云视频播放
      aliplay(file) {
        console.log(file)
        // if (player) {
        //   player.dispose();
        // }

        const saveTime = function(memoryVideo, currentTime) {
          localStorage.setItem(memoryVideo, currentTime);
        };

        const getTime = function(memoryVideo) {
          return localStorage.getItem(memoryVideo);
        };
        this.$nextTick(() => {
          player = new Aliplayer(
            {
              id: 'course-player',
              source: file,
              width: '100%',
              height: '700px',
              autoplay: false,
              isLive: false,
              components: [
                {
                  name: 'MemoryPlayComponent',
                  type: AliPlayerComponent.MemoryPlayComponent,
                  args: [false, getTime, saveTime]
                }
              ]
            },
            function(player) {
              console.log('The player is created');
            }
          );
        });
      },

			getFileType(fileName) {
				// 后缀获取
				let suffix = '';
				// 获取类型结果
				let result = '';
				try {
					const flieArr = fileName.split('.');
					suffix = flieArr[flieArr.length - 1];
				} catch (err) {
					suffix = '';
				}
				// fileName无后缀返回 false
				if (!suffix) {
					return false;
				}
				suffix = suffix.toLocaleLowerCase();
				// 图片格式
				const imglist = ['png', 'jpg', 'jpeg', 'bmp', 'gif'];
				// 进行图片匹配
				result = imglist.find(item => item === suffix);
				if (result) {
					return 'image';
				}
				// 匹配txt
				const txtlist = ['txt'];
				result = txtlist.find(item => item === suffix);
				if (result) {
					return 'txt';
				}
				// 匹配 excel
				const excelist = ['xls', 'xlsx'];
				result = excelist.find(item => item === suffix);
				if (result) {
					return 'excel';
				}
				// 匹配 word
				const wordlist = ['doc', 'docx'];
				result = wordlist.find(item => item === suffix);
				if (result) {
					return 'word';
				}
				// 匹配 pdf
				const pdflist = ['pdf'];
				result = pdflist.find(item => item === suffix);
				if (result) {
					return 'pdf';
				}
				// 匹配 ppt
				const pptlist = ['ppt', 'pptx'];
				result = pptlist.find(item => item === suffix);
				if (result) {
					return 'ppt';
				}
				// 匹配 视频
				const videolist = [
					'3gp',
					'asf',
					'avi',
					'dat',
					'dv',
			  'flv',
					'f4v',
					'gif',
					'm2t',
					'm3u8',
					'm4v',
					'mj2',
					'mjepg',
					'mkv',
					'mov',
					'mp4',
					'mpe',
					'mpg',
					'mpeg',
					'mts',
					'ogg',
					'qt',
					'rm',
					'rmab',
					'ts',
					'vob',
					'wmv',
					'webm'
				];
				result = videolist.find(item => item === suffix);
				if (result) {
					return 'video';
				}
				// 匹配 音频
				const radiolist = ['aac', 'ac3', 'acm', 'amr', 'ape', 'caf', 'flac', 'm4a', 'mp3', 'ra', 'wav', 'wma'];
				result = radiolist.find(item => item === suffix);
				if (result) {
					return 'radio';
				}
				// 匹配 swf
				const swflist = ['swf'];
				result = swflist.find(item => item === suffix);
				if (result) {
					return 'swf';
				}
				//匹配html
				const htmllist = ['html'];
				result = htmllist.find(item => item === suffix);
				if (result) {
			  return 'html';
				}
				// 其他 文件类型
				return 'other';
			},
		}

	}
</script>
<style>
	.resources .list_car::after {
		content: "";
		width: 100%;
		height: 1px;
		display: block;
		clear: both;
	}

	.resources .serch {
		padding: 0 0 13px 0;
	}

	

	.resources .sous {
		float: right;
		text-align: right;
	}

	.resources .examine .ref {
		width: 30px;
		height: 30px;
		background: #777777;
		padding: 0;
	}

	.resources .examine .ref i {
		font-size: 18px;
		color: #fff;
	}

	.resources .examine .audit {
	
		padding:  10px;
		color: #fff;
		font-size: 14px;
		border: 0;
	}


	.resources .sous .el-input {
		width: 191px;
		height: 30px;
	}

	.resources .sous .el-input input {
		height: 30px;
		border: 1px solid #EEEEEE;
	}

	.resources .sous .el-button {
		width: 30px;
		height: 30px;
		background: #F5F5F5;
		border: 1px solid #EEEEEE;
		padding: 0;
		display: inline-block;
	}

	.resources .sous .el-button img {
		width: 8px;
		height: 8px;
	}

	.resources .table .el-table {
		border-top: 1px solid #eee;
		border-left: 1px solid #eee;
		margin-bottom: 18px;
	}

	.resources .table .el-table th {
		background: #55E4C2;
	}

	.resources .table .el-table th,
	.resources .table .el-table td {
		border-right: 1px solid #eee;
		border-bottom: 1px solid #eee;
		text-align: center;
		font-size: 14px;
		font-weight: 400;
		color: #111111;
	}

	.resources .table .el-pagination {
		margin-bottom: 30px;
		text-align: right;
	}

	.resources .table .el-pagination.is-background .el-pager li:not(.disabled).active {
		background: #55E4C2;
	}

	.resources .el-form-item__label {
		width: 110px !important;
	}

	.resources .el-form-item__content {
		margin-left: 110px !important;
	}

	.resources .el-form .el-form-item__content button {
		width: 84px;
		height: 30px;
		padding: 0;
		font-size: 14px;
		color: #fff;
		background: #55E4C2;
		border: 0;
	}

	.resources .el-form .el-form-item__content button:last-child {
		background: #EB0C0C
	}

	.resources .select-list {
		margin-top: 16px;
	}

	.resources .select-list ::after {
		content: "";
		width: 100%;
		height: 1px;
		display: block;
		clear: both;
	}

	.resources .select-list li {
		width: 102px;
		height: 64px;
		float: left;
		border: 1px solid #aaa;
		margin-right: 10px;
	}

	.resources .select-list li img {
		width: 100%;
    height: 100%;
	}
	.waitAuditStyle{
		display: inline-block;
		font-size: 22px;
		margin-left: 20px;
		margin-right: 20px;
	}
	.waitAuditStyle span{
		color: #409EFF;
		cursor: pointer;
	}
	.shareText{
		cursor: pointer;
    color: #409EFF;
	}
	.greenFont{
		color: #55E4C2;
	}
  .pic_area{ height: 100%; width: 100%;}
  .ico-video{background: url('../assets/img/mp4.png') no-repeat; background-size: 100% auto;}
  .ico-doc,.ico-word{background: url('../assets/img/doc.png') no-repeat; background-size: 100% auto;}
  .ico-radio{background: url('../assets/img/mp3.png') no-repeat; background-size: 100% auto;}
  .ico-mp4{background: url('../assets/img/mp4.png') no-repeat; background-size: 100% auto;}
  .ico-pdf{background: url('../assets/img/pdf.png') no-repeat; background-size: 100% auto;}
  .ico-ppt{background: url('../assets/img/ppt.png') no-repeat; background-size: 100% auto;}
  .ico-html,.ico-swf{background: url('../assets/img/swf.png') no-repeat; background-size: 100% auto;}
  .ico-txt{background: url('../assets/img/txt.png') no-repeat; background-size: 100% auto;}
  .ico-xls,.ico-excel{background: url('../assets/img/xls.png') no-repeat; background-size: 100% auto;}
  .ico-zip{background: url('../assets/img/zip.png') no-repeat; background-size: 100% auto;}
</style>
